@extends('agent.mainlayout')
@section('title')
    <div class="title"><span id="test">代理层级管理></span></div>
@endsection

@section('content')
        <!-- start 层级管理-->
    <div class="list1">
        <div class="header" id="cengji" style="display: inline-block;">新增层级</div>
        @if(count($errors)>0)
            <div style="color:#F00;display: inline-block;margin-left: 150px;">
                @if(is_object($errors))
                    @foreach($errors->all() as $v)
                        {{$v}}
                    @endforeach
                @else
                    <p>{{$errors}}</p>
                @endif
            </div>
        @endif

        <table id="kuxuan">
            <tr>
                <th>级别</th>
                <th>级别名称</th>
                <th>进货价格折扣</th>
                <th colspan="2">操作</th>
            </tr>

            @if(!empty($res['data']))
                @foreach($res['data'] as $v)
            <tr>
                <td>{{$v['lev']}}级</td>
                <td>{{$v['lev_name']}}</td>
                <td>{{$v['discount']}}</td>
                <td style="position: relative;left: 10px;cursor: pointer;" id="bianji[]" data-id="{{$v['id']}}" jibie="{{$v['lev']}}" mingcheng="{{$v['lev_name']}}" zhekou="{{$v['discount']}}" onclick="showDialg(this)">编辑</td>
                &nbsp;
                <td style="position: relative;left: -10px;" onclick="del({{$v['id']}})">删除</td>
            </tr>
                @endforeach
             @else
                <tr>
                    <td colspan="6">暂无数据(﹀_﹀")......</td>
                </tr>
            @endif
        </table>
    </div>

    <div class="del">

    </div>


    <div id="fixed" style="display: none">
        <!-- start 新增层级-->
        <form action="{{url('center/agentlev/add')}}"  method="post" id="form1">
        <div class="fixed_one" id="fixed_one" style="display: none">
            <h3>新增层级</h3>
            <div class="one">
                <p>级别类型</p>
                <select name="lev" id="">
                    <option value="1">一级</option>
                    <option value="2">二级</option>
                    <option value="3">三级</option>
                    <option value="4">四级</option>
                    <option value="5">五级</option>
                    <option value="6">六级</option>
                    <option value="7">七级</option>
                    <option value="8">八级</option>
                </select>
            </div>
            <div class="one">
                <p>级别名称</p>
                <input type="text" name="lev_name"/>
            </div>
            <div class="one">
                <p>进货折扣</p>
                <input type="text" name="discount"/>
            </div>
            <div class="footer">
                <p id="queding1">确定</p>
                <p id="quxiao1">取消</p>
            </div>
        </div>
        </form>
        <!-- end 新增层级-->
        <!-- start 编辑层级-->
        <form action=""  method="post" id="form2">

            <div class="edit" id="edit" >
                <h3>编辑层级</h3>
                <div class="one">
                    <p>级别</p>
                    <select name="lev" id="" >
                        <option value="1">一级</option>
                        <option value="2">二级</option>
                        <option value="3">三级</option>
                        <option value="4">四级</option>
                        <option value="5">五级</option>
                        <option value="6">六级</option>
                        <option value="7">七级</option>
                        <option value="8">八级</option>
                    </select>

                </div>
                <div class="one">
                    <p>级别名称</p>
                    <input type="text" name="lev_name" required/>
                </div>
                <div class="one">
                    <p>进货折扣</p>
                    <input type="text" name="discount" required/>
                </div>
                <div class="footer">
                    <p id="queding2">确定</p>
                    <p id="quxiao2" onclick="closeDialg()">取消</p>
                </div>
            </div>
            <input type="hidden" name='id' id='idvalue' value="">
        </form>
        <!-- end 新增层级-->
    </div>

    <script>

        //删除代理层级
        function del(id){

            layer.confirm('确定要删除该项吗?',{btn:['确定','取消']},function(){
                //alert(id);
                layer.closeAll();
                layer.load(2, {shade: false});
                $.ajax({
                    type:'post',
                    url:"{{urlAdmin('Index','postDelAgentLev')}}",
                    data:{'id':id,'_token':'{{csrf_token()}}'},
                    dataType:'json',
                    success: function (res) {
                        layer.closeAll();
                        // alert(res);
                        if(res['status']==1){

                            layer.msg(res.msg,{icon:6});
                            setTimeout("location.reload()",1500);

                        }else{

                            layer.msg(res.msg,{icon:5});

                        }

                    }

                });

            },function(){

                layer.msg('已取消了!');

            });
        }


        window.onload = function(){
            /**测试layer弹窗**/


            $('#test').click(function(){


            // alert('123');
                //layer.msg('操作成功', {icon: 6});
                //layer.alert('内容');

//                layer.load(2, {shade: false});
//
//                layer.alert('偶吧深蓝style', {
//                    skin: 'layui-layer-molv'
//                    ,closeBtn: 0
//                    ,anim: 4 //动画类型
//                });


                //layer.tips('代理层级管理', '#test');


            });





            /********所有ajax加载效果**********/
            $(document).ajaxStart(function(){

                //加载效果
                layer.load(2, {shade: false});

            }).ajaxStop(function(){

                //关闭加载效果
                layer.closeAll("loading");
            });
            /********所有ajax加载效果**********/


            //加载效果
            $('.jiazai').click(function(){

                layer.load(2, {shade: false});

            });

            //酷炫效果
            var oTable = document.getElementById('kuxuan');
            var aLi = oTable.getElementsByTagName('tr');
            //var arr = ['red','blue','grey'];
            var str = '';
            for(var i=1;i<aLi.length;i++){

                //aLi[i].style.background = arr[i%3];

                aLi[i].onmouseover = function(){
                    str = this.style.background;      //将原来的颜色保存起来
                    this.style.background = '#2bdacf';
                }

                aLi[i].onmouseout = function(){
                    this.style.background = str;
                }

            }

              //alert($('*').size());  所有节点



            //快闪重定向
            var message = "{{Session::get('message')}}";
            $(window).ready(function () {
                if (message) {
                    layer.msg(message, {
                        time: 3000,

                    });
                }
            });

            var oXinzeng = document.getElementById('fixed_one');
            var aInput = oXinzeng.getElementsByTagName('input');
            var oSelect = oXinzeng.getElementsByTagName('select')[0];



            document.getElementById('cengji').onclick = function(){

                //alert('123');
                //document.getElementById('edit').style.display = "none";
                $('#edit').hide();
                //document.getElementById('fixed').style.display = "block";
                $('#fixed').show();
                //document.getElementById('fixed_one').style.display = "block";
                $('#fixed_one').show('slow');


            }

            document.getElementById('queding1').onclick = function(){

                //加载效果
                layer.load(2, {shade: false});


                document.getElementById('fixed').style.display = "none";
                document.getElementById('fixed_one').style.display = "none";
                document.getElementById('form1').submit();

            }





            document.getElementById('quxiao1').onclick = function(){

                document.getElementById('fixed').style.display = "none";
                document.getElementById('fixed_one').style.display = "none";

                for(var i=0;i<aInput.length;i++){

                    aInput[i].value = '';

                }

                oSelect.value = '1';

            }


        }

        // 显示编辑 并发送ajax 获取数据
        function showDialg(_this){
            var oedit = document.getElementById('edit');
            var fixed= document.getElementById('fixed');
            var id = _this.getAttribute('data-id');
            var input = document.getElementById("edit").getElementsByTagName('input');
            input[0].value = '';
            input[1].value = '';

            fixed.style.display = 'block';
            oedit.style.display = 'block';
            $url = "{{url('center/agentlev/edit/')}}?id="+id;
            //alert($url);
            $.ajax({
                type:"GET",
                url:$url,
                dataType:"json",
                success:function(res){
                    // 赋值到页面中
                    var input = document.getElementById("edit").getElementsByTagName('input');
                    var aSelect = document.getElementById('edit').getElementsByTagName('select')[0];
                    var aOption = aSelect.getElementsByTagName('option');
                    var Idvalue = document.getElementById('idvalue');

                   // console.log(res);
                    input[0].value = res['data']['lev_name'];
                    input[1].value = res['data']['discount'];
                    aSelect.value = res['data']['lev'];
                    Idvalue.value = res['data']['id'];


                }
            })


//            function showDialg(_this) {
//
//                $('#fixed').show('fast');
//                $('#fixed_one').show();
//
//            }


            //提交表单修改数据
            document.getElementById('queding2').onclick = function(){
                //alert('3');
                document.getElementById('fixed').style.display = "none";
                document.getElementById('edit').style.display = "none";
                document.getElementById('form2').action = "{{url('center/agentlev/save')}}?id="+id;
                document.getElementById('form2').submit();

            }


        }

        function closeDialg(){
            var fixed= document.getElementById('fixed');
            fixed.style.display = 'none';
        }


    </script>


@endsection
